<%@ page contentType="text/html;charset=UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %> 
<%@ taglib prefix="tags" tagdir="/WEB-INF/tags" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>

<html>
<head>
    <title>_库区占用管理</title>
    
	
	<script type="text/javascript">
		var tables_occupiedAreaConfig = null;
		$(function(){
			//初始化dataTables-plan
	        tables_occupiedAreaConfig=$("#table_occupiedAreaConfig").dataTable({
	           "bServerSide":true,
	           "sAjaxSource":'${ctx}/occupiedAreaConfig/findOccupiedAreaConfig',
	           "fnServerData": retrieveData_occupiedAreaConfig,
	           "bFilter": false,
	           "bSort": false,
	           "sZeroRecords": "查询无记录！",
	           "bProcessing": true,
	           "oLanguage": {
	               "sUrl": '${ctx}/static/v2/js/plugins/datatables/cn.txt'
	            },
	            "aoColumns": [
					{"mData": 'customerCode'},
					{"mData": 'warehouseCode'},
					{"mData": 'skuNum',"render": function (obj,type,full) {
                        var display="每 "+obj+"件SKU 占用面积 "+full.occupiedArea +" ㎡";
                        return display;
                     }},
					{"mData": 'assignArea'},
					{"mData": 'overPrice'},
					{"mData": 'createTime',"render": function (obj) {
                        var time=obj.time;
                        var date = new Date(time);
                        return date.Format("yyyy-MM-dd");
                     }},
					{"mData": 'createBy'},
					{"mData": 'id',"render": function (obj) {
						var id=obj;
						var str = '<a href="#configWindow" onclick="editConfig('+id+');" role="button"  class="btn btn-primary" data-toggle="modal">修改</a>&nbsp;';
						str += '<button class="btn btn-danger" onclick="delRow('+id+')" type="button">删除</button>';
                        return str;
                     }}
	           ]
	        });
		});
		function delRow(id){
			jConfirm("确定删除配置信息?","温馨提醒",function(result){
		    	if(result){
					$.ajax({
						type:'post',
						url:'${ctx}/occupiedAreaConfig/deleteOccupiedAreaConfig',
						data:{
							id:id
						},
						dataType:'json',
						success:function(data) {
							var msg=data.msg;
							if(msg=='success'){
								jAlert("删除成功!","温馨提示",function(){
									tables_occupiedAreaConfig.fnDraw();
								});
							}else{
								jAlert("删除失败!","温馨提示",function(){
									tables_occupiedAreaConfig.fnDraw();
								});
							}
						},
						error:function() {
							alert("网络繁忙，请稍后重试...");
						}
			       });
	    		}
	      	});
		}
		function editConfig(id) {
			$.ajax({
				type:'post',
				url:'${ctx}/occupiedAreaConfig/findOccupiedAreaConfigById',
				data:{
					id:id
				},
				dataType:'json',
				success:function(data) {
					var msg=data.msg;
					if(msg=='success'){
						var oac=data.oac;
						if(oac){
							$("#edi_id").val(oac.id);
							var customerStr = '<option value=""></option>';
							<c:forEach items="${customerList}" var="customer">
								customerStr += '<option value="${customer.customerCode}" >${customer.customerName}</option>';
							</c:forEach>
							$("#edi_customerCode").append(customerStr);
							$("#edi_customerCode").val(oac.customerCode);
							ajaxAreaGroupAsync(document.getElementById("edi_customerCode"),"edi_warehouseCode");
							$("#edi_warehouseCode").val(oac.warehouseCode);
							$("#edi_skuNum").val(oac.skuNum);
							$("#edi_occupiedArea").val(oac.occupiedArea);
							$("#edi_assignArea").val(oac.assignArea);
							$("#edi_overPrice").val(oac.overPrice);
							$("#edi_warehouseCode").trigger("chosen:updated");
							$("#edi_customerCode").trigger("chosen:updated");
						}else {
							jAlert("信息获取失败!","温馨提示",function(){
								
							});
						}
					}else{
						jAlert("信息获取失败!","温馨提示",function(){
							
						});
					}
				},
				error:function() {
					alert("网络繁忙，请稍后重试...");
				}
	       });
		}
		
		function saveConfig() {
			if(!$("#edi_customerCode").val()) {
				jAlert("请选择商家!","温馨提示",function(){});
				return;
			}
			if(!$("#edi_warehouseCode").val()) {
				jAlert("请选择仓库!","温馨提示",function(){});
				return;
			}
			if(!$("#edi_skuNum").val()||!$("#edi_occupiedArea").val()||!$("#edi_assignArea").val()
					||!$("#edi_overPrice").val()) {
				jAlert("所有内容都必填!","温馨提示",function(){});
				return;
			}
			$.ajax({
                cache: true,	
                type: "POST",
                url:"${ctx}/occupiedAreaConfig/ajaxSave",
                data:$('#editForm').serialize(),
                async: false,
                dataType : 'json',
                error: function(request) {
                	jAlert("服务器异常!","温馨提示",function(){
						tables_occupiedAreaConfig.fnDraw();
					});
                },
                success: function(data) {
                    var msg=data.msg;
					if(msg=='success'){
						jAlert("保存成功!","温馨提示",function(){
							$("#closeId").trigger('click'); 
							tables_occupiedAreaConfig.fnDraw();
						});				
					}else{
						jAlert("保存失败!","温馨提示",function(){
							$("#closeId").trigger('click'); 
							tables_occupiedAreaConfig.fnDraw();
						});
					}
                }
            });
		}
		function retrieveData_occupiedAreaConfig(sSource, aoData, fnCallback){
			//查询参数
		   var customerCode=$("#customerCode").val();
		   aoData.push( { "name": "customerCode", "value": customerCode } );  
		    
		   var warehouseCode=$("#warehouseCode").val();
		   aoData.push( { "name": "warehouseCode", "value": warehouseCode } );
		   
		   
		   $.ajax({ 
		       "type": "post",
		       "contentType": "application/json", 
		       "url": sSource,    
		       "dataType": "json",   
		       "data": JSON.stringify(aoData),
		       "success": function(resp) {  
	       			fnCallback(resp);
	       		}
		   }); 
		}
		
		function query() {
			tables_occupiedAreaConfig.fnDraw();
// 			tableTables_occupiedAreaConfig("action","${ctx}/warehouseAge/v2_occupiedAreaConfigQuery");
// 			 $("#queryForm").submit();
		}
		
		 function addOccupiedArea(){
			 $("#queryForm").attr("action","${ctx}/occupiedAreaConfig/v2_addOccupiedAreaConfigPage");
		     $("#queryForm").submit();
		  }
		 
    </script>
</head>

<body>
<div id="fullbg"></div>
<div id="dialog">
	<div>
		<img src="${ctx}/static/022.gif"></img>
	</div>
</div>
<section class="content">
    <!-- 查询条件  start-->
   	<div class="row">
	<div class="col-md-12">

			<!-- Primary box -->
			<div class="box box-solid box-primary" >
			    
				<div class="box-header">
					<i class="fa fa-search"></i>
					<h3 class="box-title">搜索栏</h3>
				</div>
				
				<div class="box-body">
				    <form class="form-search" id="queryForm" method="post" action="${ctx}/occupiedAreaConfig/findOccupiedAreaConfig" style="margin-top: 10px;">
					    <!-- 第一行 -->
						<div class="form-group row">
							<div class="col-sm-3">
								<div class="input-group col-sm-12">
									<span class="input-group-text"> 商家名称： </span> 
									<select class="form-control" id="customerCode" name="customerCode" onchange="ajaxAreaGroup(this,'warehouseCode')">
										<option value=""></option>
										<c:forEach items="${customerList}" var="customer">
											<option value="${customer.customerCode}"
												<c:if test="${customerCode eq customer.customerCode}">selected=selected</c:if>>${customer.customerName}</option>
										</c:forEach>
									</select>
								</div>
							</div>
							
							<div class="col-sm-3">
								<div class="input-group col-sm-12">
									<span class="input-group-text"> 仓库： </span> 
									<select class="form-control" id="warehouseCode" name="warehouseCode" >
										<option value=""></option>
										<c:forEach items="${warehouseList}" var="warehouse">
											<option value="${warehouse.groupCode}"
												<c:if test="${warehouseCode eq warehouse.groupCode}">selected=selected</c:if>>${warehouse.groupName}</option>
										</c:forEach>
									</select>
								</div>
							</div>
							
							
						</div>
						<div class="form-group row">
							<div class="col-sm-6">
								<button class="btn btn-info" type="button" onclick="query();">搜索</button>
								<button class="btn btn-info" type="button" style="margin-left: 10px;" onclick="addOccupiedArea();">添加仓租配置</button>
							</div>
						</div>
					</form>
				</div>

			</div>

	 </div>
	</div>
    <!-- 查询条件 end -->
    
    <!-- 查询结果 start -->
	<div class="form-group row" >
		<div class="col-md-12">
	       <div class="box box-primary">
				 <div class="box-header"></div>
				 <div class="box-body table-responsive">
				     <table id="table_occupiedAreaConfig" class="table table-bordered table-striped">
				         <thead>
				             <tr>
				                <th style="width: 80px;">商家编码</th>
							    <th style="width: 80px;">仓库编码</th>
							    <th style="width: 140px;">SKU数量/占用面积</th>
							    <th style="width: 60px;">分配商家总面积</th>
							    <th style="width: 60px;">超出每平方单价</th>
								<th style="width: 60px;">创建时间</th>
								<th style="width: 80px;">创建人</th>
								<th style="width: 80px;">操作</th>
				             </tr>
				         </thead>
				     </table>
				 </div>
			 </div>
		
		</div>
	</div>
	
	
	<div class="modal fade"
			tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
			aria-hidden="true" style="height:1600px;width:1500;" id="configWindow">
			<div class="modal-dialog" >
			<div class="modal-content" >
			<div class="modal-header">
				<h3 id="myModalLabel">
					修改配置
				</h3>
			</div>
			<div class="modal-body" style="width: 1300;height:400px; overflow: auto;">
				<form class="form-search" id="editForm" method="post" action="${ctx}/occupiedAreaConfig/findOccupiedAreaConfig" style="margin-top: 10px;">
				<input id="edi_id" name="id" type="hidden"/>
						<table>
							<tr>
								<td align="right">
									商家名称： 
								</td>
								<td style="height:40px;width:200px;">
									<div class="form-group row">
										<div class="col-sm-12">
											<div class="input-group col-sm-12">
												<select class="form-control" id="edi_customerCode" name="customerCode" onchange="ajaxAreaGroup(this,'edi_warehouseCode')">
													<option value=""></option>
													<c:forEach items="${customerList}" var="customer">
														<option value="${customer.customerCode}"
															<c:if test="${customerCode eq customer.customerCode}">selected=selected</c:if>>${customer.customerName}</option>
													</c:forEach>
												</select>
											</div>
										</div>
									</div>
								</td>							
							</tr>
							<tr>
								<td align="right">
									仓库：
								</td>
								<td  style="height:40px;width:200px;">
									<div class="form-group row">
										<div class="col-sm-12">
											<div class="input-group col-sm-12">
												<select class="form-control" id="edi_warehouseCode" name="warehouseCode" >
													<option value=""></option>
													<c:forEach items="${warehouseList}" var="warehouse">
														<option value="${warehouse.groupCode}"
															<c:if test="${warehouseCode eq warehouse.groupCode}">selected=selected</c:if>>${warehouse.groupName}</option>
													</c:forEach>
												</select>
											</div>
										</div>
									</div>
								</td>
							</tr>
							<tr>
								<td align="right">
									SKU数量(件)/占用面积 (㎡ ):
								</td>
								<td style="height:40px;width:350px;">
									<!-- 第一行 -->
									<div class="form-group row">
										<div class="col-sm-4">
											<div class="input-group col-sm-12">
												<span class="input-group-text"> 每&nbsp;&nbsp; </span> 
												<input style="width:80px;" class="form-control required"  name="skuNum"  id="edi_skuNum" />
											</div>
										</div>
										<div class="col-sm-7">
											<div class="input-group col-sm-12">
												<span class="input-group-text"> &nbsp;件SKU &nbsp;占用面积&nbsp; </span> 
												<input style="width:80px;" class="form-control required"  name="occupiedArea" id="edi_occupiedArea"/> 
											</div>
										</div>
									</div>
								</td>
							</tr>
							<tr>
								<td align="right">
									分配商家总面积 (单位:㎡ ):
								</td>
								<td  style="height:40px;width:200px;">
									<div class="form-group row">
										<div class="col-sm-11">
											<div class="input-group col-sm-12">
												<input style="width:90%;"   class="form-control required"  name="assignArea" id="edi_assignArea" />
											</div>
										</div>
									</div>
									
								</td>
							</tr>
							<tr>
								<td align="right">
									超出每平方单价 (单位:元):
								</td>
								<td  style="height:40px;width:200px;">
									<div class="form-group row">
										<div class="col-sm-11">
											<div class="input-group col-sm-12">
												<input style="width:90%;" class="form-control required"   name="overPrice" id="edi_overPrice" />
											</div>
										</div>
									</div>
								</td>
							</tr>
						</table>
					</form>
			</div>
			<div class="modal-footer">
				<a href="#" onclick="saveConfig()" role="button"  class="btn btn-primary" data-toggle="modal">
					保存
				</a>
				<button class="btn" id="closeId" data-dismiss="modal" aria-hidden="true">
					关闭
				</button>
			</div>
		</div>
		</div>
	</div>
	
</section>     
</body>
</html>
